<template>
  <div> 
    <van-tabbar v-model="active" active-color="blue" inactive-color="#000" route="true">
      <van-tabbar-item to="/ppc"> <van-icon name="wap-home-o" size="1.5rem" /><p>周边</p></van-tabbar-item>
      <van-tabbar-item to="/two"><van-icon name="smile-o" size="1.5rem" /><p>发现</p> </van-tabbar-item>
      <!-- <van-tabbar-item to="/three"><van-icon name="location-o" size="1.5rem" /><p>票夹</p></van-tabbar-item> -->
      <van-tabbar-item to="/four"><van-icon name="manager-o" size="1.5rem" /><p> 我的</p></van-tabbar-item>
    </van-tabbar>
    <router-view></router-view>
  </div>
  
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const active = ref(0);
    return { active };
  },
};

  </script>
<style lang="scss">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

  body,h1,h2,h3,h4,h5,h6,p,ul,form,dl,dd,dt{
    padding: 0;
    margin: 0;
  }
  img{
    display: block;
    border: none;
  }
 
</style>
